<template>
	<view>
		<view class="head">
			<image class="img" src="../../static/zonghe/fw.png" mode=""></image>
		</view>
		<!-- 服务咨询费 -->
		<view class="main">
			<view class="title">
				服务咨询费
			</view>
			<view class="money">
				¥ 10000
			</view>
			<view class="txt">
				订单提交成功，请在10分钟内完成支付
			</view>

			<view class="zf">
				<view class="wx list">
					<image class="img1" src="../../static/zonghe/wx.png" mode=""></image>
					<view class="txt1">
						微信支付
					</view>
					<u-radio-group v-model="value" @change="radioGroupChange">
						<u-radio name="微信支付" >
						</u-radio>
					</u-radio-group>
				</view>
				<u-line color="#dedede" />
				<view class="zfb list">
					<image class="img1" src="../../static/zonghe/zfb.png" mode=""></image>
					<view class="txt1">
						支付宝
					</view>
					<u-radio-group v-model="value" @change="radioGroupChange">
						<u-radio name="支付宝" >
						</u-radio>
					</u-radio-group>
				</view>
			</view>
		</view>
		<!-- 立即支付 -->
		<view class="btn">
			立即支付
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value: '',
				disabled: true
			};
		},
		methods: {
			// 单选
			radioGroupChange(e) {
				console.log(e);
			},
			}
		
	}
</script>

<style lang="scss">
	page {
		background-color: #F5F5F5;
	}

	.head {

		width: 100%;
		height: 438rpx;
	}

	.main {

		width: 90%;
		margin: 30rpx auto;
		border-radius: 25rpx;
		background-color: #fff;
		padding-bottom: 30rpx;
		padding-top: 20rpx;

		.title {
			text-align: center;
			font-size: 32rpx;
			font-weight: 600;
			margin: 40rpx;
		}

		.money {
			color: #EC0D0D;
			font-size: 56rpx;
			text-align: center;
			font-weight: 700;
		}

		.txt {
			text-align: center;
			font-size: 24rpx;
			margin: 40rpx;
		}

		.zf {

			.wx {}

			.list {
				display: flex;
				justify-content: space-between;
				width: 90%;
				padding: 10rpx 0;
				margin: 0 20rpx;

				.txt1 {
					width: 70%;
					line-height: 50rpx;
				}

				.img1 {
					width: 50rpx;
					height: 50rpx;
				}
			}
		}
	}

	.btn {
		margin: auto;
		margin-top: 200rpx;
		color: #FFFFFF;
		font-size: 28rpx;
		width: 620rpx;
		height: 80rpx;
		line-height: 80rpx;
		border-radius: 10rpx;
		background-color: rgba(110, 208, 72, 100);
		text-align: center;
		border: 2rpx solid rgba(255, 255, 255, 100);
	}
</style>
